<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>${config.siteName}</title>
    <link rel="stylesheet" href="/assets/plugins/layui/css/layui.css">
  
   <style type="text/css">
   
   body {
    background-color: #e7e7e7;
}

input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 1000px #fff;
    background-color: transparent;

}

.login-login-background {
    width: 300px;
    height: 300px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -150px;
    margin-top: -100px;
}

.login-header {
    margin-top: -100px;
    margin-bottom: 20px;
}

.login-logo {
    width: 280px;
}

.login-button {
    margin-top: 20px;
}

.login-input {

    border-top-style: none;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    height: 50px;
    width: 300px;
    padding-bottom: 0px;
}


.login-input-username {
    border-top-style: solid;
    border-radius: 10px 10px 0 0;
}

.login-input-verify {
    border-radius: 0 0 10px 10px;
}

.login-button {
    width: 300px;
    height: 50px;
    border-radius: 4px;
    background-color: #2d8cf0;
}

.login-icon {
    margin-left: 260px;
    margin-top: 10px;
    font-size: 30px;
}

i {
    position: absolute;
}

.login-captcha {
    position: absolute;
    margin-left: 150px;
    margin-top: -40px;
}
   </style>
</head>
<body>
 
<div class="container">
   <div class="login-login-background">
   
   <div class="layui-header header header-doc">
	   <div class="layui-main" style="align:center">
	       <h1>${licence.username}</h1>
	   </div>
											<#if message?exists>
											<div class="layui-main">
												${message?if_exists}</div>
											</#if>
   </div>

    <form class="layui-form"  method="POST" id="login-form">
        
       
											
											
         <div class="layui-form-item">
		    <!-- <label class="layui-form-label">用户名</label> -->
		      <div class="layui-input-inline">
		            <i class="layui-icon layui-icon-username login-icon login-icon-username"></i>
		            <input type="text" name="username" required lay-verify="required" placeholder="用户名" autocomplete="off" class="layui-input login-input login-input-username">
		        </div>
		  </div>
        
         <div class="layui-form-item">
         <!-- <label class="layui-form-label">密码</label> -->
	        <div class="layui-input-inline">
	        	<i class="layui-icon layui-icon-password login-icon login-icon-password"></i>
	            <input type="password" name="password" required lay-verify="required" placeholder="密码" autocomplete="off" class="layui-input login-input">
	        </div>
        </div>
        
         <!--  <div class="layui-form-item"> -->
         <!--  <label class="layui-form-label">验证码</label> -->
	       <!--  <div class="layui-input-inline">
	                <input type="text" name="kaptcha" placeholder="请输入验证码" autocomplete="off" class="layui-input login-input login-input-verify">
	                <img alt="点击获取验证码" id="img-kaptcha" src="/getKaptcha" class="login-captcha">
	            </div>
          </div> -->
            
              <div class="layui-form-item">
          <div class="layui-input-inline">
				<input type="checkbox" id="rememberMe" name="rememberMe" title="记住我" lay-skin="primary" value="1"> 
            </div>
            </div>
            
        <div class="layui-input-inline login-btn">
            <button lay-submit lay-filter="login" class="layui-btn login-button">登录</button>
        </div>
        <hr/>
        <!--<div class="layui-input-inline">
            <button type="button" class="layui-btn layui-btn-primary">QQ登录</button>
        </div>
        <div class="layui-input-inline">
            <button type="button" class="layui-btn layui-btn-normal">微信登录</button>
        </div>-->
       <!--  <p><a href="register.html" class="fl">立即注册</a><a href="/user/forget" class="" style="margin-left: 166px;">忘记密码？</a></p> -->
        
    </form>
    
    
        	<div class="layui-footer footer footer-doc">
					<div class="layui-main">
						<#-- <p><h1>${licence.productname}</h1></p> -->
						<p>Copyright © ${.now?string["yyyy"]} ${licence.copyright}. All Rights Reserved.</p>
					</div>
				</div>
    </div>
</div>
 
 
<script src="/assets/plugins/layui/layui.js"></script>
<script type="text/javascript">
    layui.use(['form','layer','jquery'], function () {
 
        // 操作对象
        var form = layui.form;
        var $ = layui.jquery;
        form.on('submit(login)',function (data) {
            // console.log(data.field);
              var arr = new Array();
            $("input:checkbox[name='rememberMe']:checked").each(function(i){
                arr[i] = $(this).val();
            });
            $.ajax({
                type: "POST",
                url: "/auth/signin",
                data: $("#login-form").serialize(),
                dataType: "json",
                success: function (json) {
                    if (json.status == 200) {
                        window.location.href = "/";
                    }else{
                        layer.alert(json.message, {
							  icon: 1,
							  time: 2000 //2秒关闭（如果不配置，默认是3秒）
							},function(index){
					  	  layer.close(index);
						});  
						
						
						
                        $("#img-kaptcha").attr("src", '/getKaptcha?time=' + new Date().getTime());
                    }
                }
            });
            return false;
        })
        
        $("#img-kaptcha").click(function () {
            $(this).attr("src", '/getKaptcha?time=' + new Date().getTime());
        });
        
 
    });
</script>
</body>
</html>